@charset "utf-8";



.web{
	width: 1366px;
	height: 3493px;
	
	header{
		// position: relative;
		
		.top{
			width: 100%;
			height: 40px;
			background-color: #212121;
			display: flex;
			
			.img{
				height: 23px;
				width: 85px;
				display: flex;
				justify-content: space-between;
				margin-left: 184px;
				margin-top: 10px;
				align-items: flex-end;
			}
			p{
				color: #bbbbbb;
				font-size: 12px;
				margin-left: 745px;
				margin-top: 20px;
			}
			
		}
		nav{
			// margin-bottom: 0;
			
			.con{
				
				
				
				.middle{
					display: flex;
					background-color: #FFFFFF;
					height: 100px;
					width: 100%;
					align-items: flex-end;
					padding-left: 276px;
					img{
						margin-right: 95px;
					}
					li{
						
						margin-right: 58px;
						font-size: 14px;
						a{
							text-decoration: none;
							color: #000000;
						}
					}
				}
				.logo{
					width: 60px;
					height: 100%;
					margin-right: 103px;
					padding-top: 5px;
				}
				
			}
				
		
		}
		.end{
			width: 1366px;
			height: 474px;
			// top: 0;
			// left: 0;
			margin-top: 14px;
			
			position: relative;
			// transform: translate(-50%,-50%);
			// padding-top: 28.1%;
			overflow: hidden;
			ul{
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				font-size: 0;
				white-space: nowrap;
				transition: all 1s;
				li{
					display: inline-block;
					width: 100%;
					
					img{
						width: 100%;
					}
				}
			}
			
			.arrow{
				width: 10%;
				height: 100%;
				position: absolute;
				top: 0;
				font-size: 20px;
				text-align: center;
				display: flex;
				justify-content: center;
				align-items: center;
				transition: all .8s;
				cursor: pointer;
			}
			.left_arrow{
				left: 0;
				background: linear-gradient(90deg,gray,transparent);
				transform: translateX(-100%) ;
			}
			.right_arrow{
				right: 0;
				background: linear-gradient(90deg,transparent,gray);
				transform: translateX(100%) ;
			}
			&:hover .arrow{
				transform: translateX(0) ;
				font-size: 60px;
			}
			
			&:hover ol{
				bottom: 10%;
			}
			
			ol{
				position: absolute;
				left: 50%;
				bottom: -10%;
				transform: translateX(-50%);
				font-size: 0;
				transition: all .5s;
				li{
					width: 12px;
					height: 12px;
					margin: 0 4px;
					background-color: orange;
					border-radius: 50%;
					display: inline-block;
					&:hover,&.active{
						background-color: #FF0000;
					}
				}
			}
			
			
		}

	}
	
	
	.section{
		// height: 2520px;
		width: 100%;
		.one{
			height: 40px;
			width: 197px;
			margin-left: 583px;
			margin-top: 52px;
			display: flex;
			justify-content: space-between;
			
			.wire{
				width: 64px;
				height: 1px;
				background-color: #000000;
				margin-top: 15px;
			}
			.zi{
				display: flex;
				flex-wrap: wrap;
				text-align: center;
				justify-content: space-around;
				p{
					font-size: 18px;
					// margin-left: 17px;
				}
				span{
					font-size: 14px;
					color: #959595;
					// margin-left: 15px;
				}
			}
		}
		
		
		.two{
			width: 68%;
			
			height: 743px;
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			margin-top: 34px;
			margin-left: 242px;
			.sheet{
				height: 197px;
				width: 161px;
				text-align: center;
				margin-right: 66px;
				p{
					font-size: 14px;
					margin-top: 7px;
				}
				img{
					margin-bottom: 32px;
				}
			}
		}
		

		.more{
			width: 120px;
			height: 45px;
			text-align: center;
			border: 1px solid #a0a0a0;
			margin-left: 623px;
			font-size: 14px;
			color: #a8a8b7;
			line-height: 45px;
		}
		
		
		.three{
			width: 73%;
			height: 260px;
			margin-left: 183px;
			margin-top: 30px;
		}
		
		
		
		.recur{
			width: 68%;
			height: 457px;
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			margin-top: 34px;
			margin-left: 242px;
			margin-bottom: 43px;
			.sheet{
				height: 197px;
				width: 161px;
				text-align: center;
				margin-right: 66px;
				p{
					font-size: 14px;
					margin-top: 7px;
				}
				img{
					margin-bottom: 32px;
				}
			}
		}
		
		
		
		.end{
			height: 585px;
			width: 73%;
			margin-left: 183px;
			display: flex;
			flex-wrap: wrap;
			margin-top: 37px;
			.en{
				
				width: 66%;
				display: flex;
				flex-wrap: wrap;
				img{
					width: 326px;
					height: 292px;
					margin-right: 2px;
					margin-bottom: 1px;
				}
			}
			.ens{
				width: 34%;
				
			}
			
		}
		
		
		
	}
	
	
	
	
	
	.footer{
		width: 73%;
		height: 286px;
		background: url(../首页图片/手表index23_10.jpg);
		margin-top: 59px;
		margin-left: 183px;
		.sale{
			width: 774px;
			// height: 165px;
			padding-top: 41px;
			margin-left: 111px;
			display: flex;
			justify-content: space-between;
			.hos{
				width: 200px;
				h3{
					font-size: 14px;
					color: #dcdcdc;
				}
				p{
					width: 200px;
					height: 1px;
					border-bottom: 1px solid #dbdbea;
					padding-top: 7px;
					margin-bottom: 11px;
				}
				li{
					font-size: 12px;
					color: #dcdcdc;
					margin-bottom: 18px;
				}
				a{
					color: #dcdcdc;
					text-decoration: none;
				}
			}
			
	
			
		}
		
		.ss{
			height: 16px;
			display: flex;
			margin-left: 88px;
			padding-top: 22px;
			p{
				font-size: 14px;
				color: #dcdcdc;
				margin-right: 40px;
			}
		}
	}
}

